@use "sass:map";

// {bem_b,bem_e,bem_m,VueAndNvueStyleAttr,when}
@use  './mixin/mixins.scss' as *;
@use './mixin/function.scss' as *;
// // {set-component-css-var}
@use  './mixin/_var.scss' as *;

@import 'common/index.scss';

@include bem_b(sliders) {
	@include flex(row);
	/*  #ifndef  APP-NVUE  */
	width: 100%;
	/*  #endif  */
	
	
	flex: 1;
	position: relative;
	align-items: center;
	overflow: hidden;
	
	
	@include bem_e(body){
		@include flex(row);
		position: absolute;
		left: 0;
		top: 0;
		bottom: 0;
		transition-property:width;
		transition-timing-function:ease-in-out;
		overflow: hidden;
		/*  #ifndef  APP-NVUE  */
		z-index: 5;
		/*  #endif  */
		
	}

	@include bem_e(block) {
		@include flex(row);
		position: relative;
		align-items: center;
		justify-content: center;
		/*  #ifndef  APP-NVUE  */
		z-index: 2;
		
		/*  #endif  */
		
		
		
	}
	@include bem_e(hood) {
		@include flex(row);
		
		flex: 1;
		align-items: center;
		justify-content: center;
		
		&__text{
			color: #ffffff;
		}
	}
	@include bem_e(content) {
		@include flex(row);
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		align-items: center;
		justify-content: center;
		
		/*  #ifndef  APP-NVUE  */
		z-index: 1;
		/*  #endif  */
		
		&__text{
			@include VueAndNvueStyleAttr('color','sliders', 'color');
		}
	}
}
